

<script lang="ts" setup>
import ConfigTextView from '@/components/config/ConfigTextView.vue'  // 新增导入
import { useTextStore } from "@/stores/config/configTextStore"
import { toRaw } from 'vue'
import { onMounted, onUnmounted } from 'vue'
import { useEditorSettingStore } from './stores/editorSettingStore'
import '@vue-flow/core/dist/style.css'
import "@vue-flow/core/dist/theme-default.css"
import { ElMessage } from 'element-plus'
const electron = require("electron")
let textStore = useTextStore()
let editorSettingStore = useEditorSettingStore()
let getTextData = function () {
    electron.ipcRenderer.invoke('getData').then((data: any) => {
        console.log('Loaded text data:', data);
        textStore.$patch(data.text);
        editorSettingStore.$patch(data.editorSetting);
    });
}
let saveTextData = function () {
    electron.ipcRenderer.invoke('saveTextStore', toRaw(textStore.$state)).then((result: any) => {
        if (result.success) {
          ElMessage.success('保存成功');
          console.log('Saved text data:', result);
        }
    })
}
electron.ipcRenderer.on("dataUpdated", (event: any, data: { text: any }) => { 
    textStore.$patch(data.text);
})
// 添加键盘事件处理
const handleKeyDown = (event: KeyboardEvent) => {
  if ((event.ctrlKey || event.metaKey) && event.key.toLowerCase() === 's') {
    event.preventDefault();
    saveTextData();
  }
};

onMounted(() => {
  window.addEventListener('keydown', handleKeyDown);
});

onUnmounted(() => {
  window.removeEventListener('keydown', handleKeyDown);
});
getTextData()
</script>

<template>
  <div class="text-manager-container">
    <ConfigTextView />
  </div>
</template>

<style scoped>
.text-manager-container {
  padding: 20px;
  max-width: 1200px;
  margin: 0 auto;
}
.toolbar {
  margin-bottom: 15px;
  display: flex;
  gap: 10px;
}
</style>